<!DOCTYPE html>
<html>

	<head>
		<meta charset="utf-8">
		<meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
		<title>良品铺子</title>
			<link rel="icon" type="image/png" href="http://m.lppz.com/images/favicon.png">
		<link rel="stylesheet" type="text/css" href="css/iconfont.css" />
		<link rel="stylesheet" type="text/css" href="lib/weui.min.css" />
		<link rel="stylesheet" type="text/css" href="css/jquery-weui.min.css" />
		<link rel="stylesheet" type="text/css" href="css/home.css" />
	</head>

	<body ontouchstart>
		<script src="lib/jquery-2.1.4.js" type="text/javascript" charset="utf-8"></script>

		<div class="weui_tab">
			<div class="header" id="top">
				<div class="header_logo"></div>
				<div class="weui_search_bar" id="search_bar">
					<form class="weui_search_outer">
						<div class="weui_search_inner">
							<i class="weui_icon_search"></i>
							<input type="search" class="weui_search_input" id="search_input" />
							<a href="javascript:" class="weui_icon_clear" id="search_clear"></a>
						</div>
						<label for="search_input" class="weui_search_text" id="search_text">
      						<i class="weui_icon_search"></i>
      						<span></span>
    					</label>
					</form>
				</div>
				<div class="header_ico">
					<i class="iconfont">&#xe6f5;</i>
				</div>
				<script type="text/javascript">
					$(".header_ico i").click(function(){
						window.location.href = "fenlei/fenlei.html";
					})
				</script>
			</div>
			<div class="weui_tab_bd mainbody">
				<div class="bodywrap">
					<div class="swiper-container">
						<div class="swiper-wrapper">
							<div class="swiper-slide"><img src="img/CghmQ1eO6LaAKNGeAAImLXZsakk583.jpg"></div>
							<div class="swiper-slide"><img src="img/CghmQldx0XqAYSnEAAEXJv101bQ192.jpg"></div>
						</div>
						<div class="swiper-pagination"></div>
					</div>
					<div class="body_sort weui-row">
						<div class="weui-col-25">
							<img src="img/icon_integral.png" />
							<p>我的优惠卷</p>
						</div>
						<div class="weui-col-25">
							<img src="img/icon_coupon.png" />
							<p>特惠精选</p>
						</div>
						<div class="weui-col-25">
							<img src="img/icon_logistics.png" />
							<p>物流查询</p>
						</div>
						<div class="weui-col-25">
							<img src="img/icon_concern.png">
							<p>我的关注</p>
						</div>
					</div>
					<div class="body_picplace">
						<a href="#"><img src="img/CghmQleO8rmAACsoAABVtC0bhro199.jpg" /></a>
					</div>
					<!--五折-->
					<div class="body_title">
						<img src="img/CghmQleO6naAM3dkAACZ1Ig5yXA952.jpg" alt="" />
					</div>
					<div class="body_recom weui-row">
						<div class="recom_item weui-col-50">
							<a href="goods/good.html">
								<img src="img/CghmQ1eNnbuAQdZ7AABGtMt2KYU893.jpg" />
								<p class="recom_item_title">【4.9秒杀】脆冬枣 35g （全场满68元包邮）</p>
							</a>
							<div class="recom_desc">
								<span>￥4.9</span>
								<span class="iconfont recom_desc_tip">&#xe6b9;</span>
							</div>
						</div>
						<div class="recom_item weui-col-50">
							<a href="#">
								<img src="img/CghmQleNngSAN9OPAABME6cu4PA641.jpg" />
								<p class="recom_item_title">【4.9秒杀】甘栗 80g 每个ID限购3份（全场满68元包邮）</p>
							</a>
							<div class="recom_desc">
								<span>￥4.9</span>
								<span class="iconfont recom_desc_tip">&#xe6b9;</span>
							</div>
						</div>
						<div class="recom_item weui-col-50">
							<a href="#">
								<img src="img/CghmQ1eNoqWALoAoAABb306MK28272.jpg" />
								<p class="recom_item_title">【5折秒杀】蔓越莓干100g （全场满68元包邮）</p>
							</a>
							<div class="recom_desc">
								<span>￥6.9</span>
								<span class="iconfont recom_desc_tip">&#xe6b9;</span>
							</div>
						</div>
						<div class="recom_item weui-col-50">
							<a href="#">
								<img src="img/CghmQ1eYXOyAeMiSAAA-z_Ao1JI623.jpg" />
								<p class="recom_item_title">【良品铺子】乐天白巧克力棒32g （全场满68元包邮）</p>
							</a>
							<div class="recom_desc">
								<span>￥7.9</span>
								<span class="iconfont recom_desc_tip">&#xe6b9;</span>
							</div>
						</div>
					</div>
					<!--夏季-->
					<div class="body_title">
						<img src="img/xiaji_title.jpg" alt="" />
					</div>
					<div class="body_recom weui-row">
						<div class="recom_item weui-col-50">
							<a href="#">
								<img src="img/xiaji01.jpg" />
								<p class="recom_item_title">【良品铺子】牛板筋（烧烤味）180g （全场满68元包邮）</p>
							</a>
							<div class="recom_desc">
								<span>￥20.9</span>
								<span class="iconfont recom_desc_tip">&#xe6b9;</span>
							</div>
						</div>
						<div class="recom_item weui-col-50">
							<a href="#">
								<img src="img/xiaji02.jpg" />
								<p class="recom_item_title">【良品铺子】风琴鱿鱼 香辣味 80g （全场满68元包邮）</p>
							</a>
							<div class="recom_desc">
								<span>￥12.9</span>
								<span class="iconfont recom_desc_tip">&#xe6b9;</span>
							</div>
						</div>
						<div class="recom_item weui-col-50">
							<a href="#">
								<img src="img/xiaji03.jpg" />
								<p class="recom_item_title">【良品铺子】鸡蛋干酱香味158g （全场满68元包邮）</p>
							</a>
							<div class="recom_desc">
								<span>￥9.9</span>
								<span class="iconfont recom_desc_tip">&#xe6b9;</span>
							</div>
						</div>
						<div class="recom_item weui-col-50">
							<a href="#">
								<img src="img/xiaji04.jpg" />
								<p class="recom_item_title">【良品铺子】吸吸龟苓膏（金银花味）180g （全场满68元包邮）</p>
							</a>
							<div class="recom_desc">
								<span>￥5.9</span>
								<span class="iconfont recom_desc_tip">&#xe6b9;</span>
							</div>
						</div>
					</div>
				</div>
			</div>
		</div>
		<div class="cart">
			<a href="cart/cart.html">
				<span class="iconfont shoppingcart">&#xe6b9;</span>
				<span class="cartsum iconfont">0</span>
			</a>
		</div>
		<div class="gotop">
			<a href="#top"><i class="iconfont">&#xe6d6;</i></a>
		</div>
		<div class="weui_tabbar">
			<a href="#tab1" class="weui_tabbar_item weui_bar_item_on">
				<div class="weui_tabbar_icon">
					<i class="iconfont">&#xe625;</i>
				</div>
				<p class="weui_tabbar_label">首页</p>
			</a>
			<a href="#tab2" class="weui_tabbar_item fenlei">
				<div class="weui_tabbar_icon">
					<i class="iconfont">&#xe681;</i>
				</div>
				<p class="weui_tabbar_label">分类</p>
				<div class="bottom_menu">
					<li href="#">坚果炒货</li>
					<li href="#">肉铺鱼干</li>
					<li href="#">糕点糖果</li>
					<li href="#">素食山珍</li>
					<li href="#">花菜饮品</li>
					<li href="#">进口食品</li>
					<li href="#">精选礼盒</li>
					<li href="#">当季热销</li>
					<li href="#">全部分类</li>
				</div>
			</a>
			<a href="cart/cart.html" class="weui_tabbar_item">
				<div class="weui_tabbar_icon">
					<i class="iconfont">&#xe670;</i>
				</div>
				<p class="weui_tabbar_label">购物车</p>
			</a>
			<a href="javascript:;" class="weui_tabbar_item">
				<div class="weui_tabbar_icon">
					<i class="iconfont">&#xe60d;</i>
				</div>
				<p class="weui_tabbar_label">我的良品</p>
			</a>
		</div>

		<script src="js/jquery-weui.min.js" type="text/javascript" charset="utf-8"></script>
		<script src="js/swiper.js" type="text/javascript" charset="utf-8"></script>
		<script type="text/javascript">
			$(".swiper-container").swiper({
				pagination: '.swiper-pagination',
				loop: true,
				autoplay: 2000
			})
			$(function() {
				$(".gotop").click(function(){
					$("html").animate({
						scrollTop: "0px"	
					},"slow")
				});
				$(".weui_tabbar_item:nth-child(2)").click(function() {
					$(".bottom_menu").slideToggle(600);
				})
				$(".weui_tabbar_item:nth-child(4)").click(function(){
					if(localStorage.user){
						window.location.href = "personal/personal.html";
					}else{
						window.location.href = "login/login.html";
					}
				})
				//获取数量
				if(sessionStorage.goods){
					var temp = JSON.parse(sessionStorage.goods);
					var sum = 0;
					for(var k = 0; k < temp.length; k++){
						sum += parseInt(temp[k].num);
					}
					$(".cartsum").html(sum);
				}
				//购物车添加
				var sum = parseInt($(".cartsum").html())+1;
				$(".recom_desc .recom_desc_tip").click(function(){
					var $sOffSet = $(this).offset();
					var $eOffSet = $(".cart").offset();
					var $tip = $(this).clone();
					$tip.css({
						"position": "absolute",
						"left": $sOffSet.left,
						"top": $sOffSet.top,
						"color": "#E50012"
					});
					$("body").append($tip);
					$tip.animate({
						"left": $eOffSet.left,
						"top": $eOffSet.top
					},"slow",function(){
						$($tip).remove();
						$(".cartsum").html(sum++);
					});
//					$(this).replaceWith("<span class='iconfont '>&#xe6b8;</span>");
					var $price = $(this).prev().text().substr(1);
					var $name = $(this).parent().prev().children().text();
					$name = $name.substring($name.indexOf("】")+1,$name.lastIndexOf("（"));
					var $osrc = $(this).parent().prev().children().prop("src");
					$osrc = $osrc.substring($osrc.lastIndexOf("/"));
					var good = {
						"name": $name,
						"price": $price,
						"src" : $osrc,
						"num" : 1
					}
					if(sessionStorage.goods){
						var arr = JSON.parse(sessionStorage.goods);
						for (var j in arr) {
							if(good.name == arr[j].name){
								arr[j].num++;
								//存在重名即跳出，不必再循环
								break;
							}else{
								//判断是否遍历完全
								if(j >= arr.length-1){
									arr.push(good);
								}
							}
						}
						sessionStorage.goods = JSON.stringify(arr);
					}else{
						sessionStorage.goods = JSON.stringify([good]);
					}
					$.toast("添加成功");
				});
			})
		</script>
	</body>

</html>